<template>
	<view>
		<view class="top contenr">
			  <textarea  placeholder="请描述您使用过程中遇到的问题和建议~" v-model="textarea" maxlength="200"  @input ="descInput"/>
		</view>
		<view class="active contenr">{{remnant}}/200字</view>
		<!-- <view class="contens dis dis2">
			<text class="texts">联系方式</text>
			<input type="text" placeholder="手机号/微信/QQ~"  v-model="inputValue" />
		</view> -->
		<view class="btn contenr" v-if="textarea ">
			<image src="../../../static/image/btn_1.png" mode="aspectFit" class="imgs" @click="submit"></image>
		</view>
		<view class="btn contenr" v-else>
			<image src="../../../static/image/ico6.png" mode="aspectFit" class="imgs"></image>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				textarea:'',
				remnant:0,
				inputValue:''
			}
		},
		methods: {
			descInput(e){
				// console.log(e)
				let that = this;
				var txtVal = this.textarea.length;
				   this.remnant = 200-txtVal;
				 if(this.textarea.length>=200){
					 that.$http.isMssage('请简要描述')
				 }
			},
			submit(){
				let that =this;
				this.$http._post('other/feedback.do',{
					 content:this.textarea
				}).then(res=>{
					if(res.data.issuccess==1){
						that.$http.isMssage(res.data.data);
						setTimeout(()=>{
							uni.navigateBack({
								date:1
							})
						},2000)
					}
					console.log(res)
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import "../../../common/css/flex.css";
	@import "../../../common/css/index.scss";
	.top{
		height: 420upx;
		width: 100%;
		background-color: #fff;
		textarea{
			width: 90%;
			height: 80%;
			font-size:32upx;
			font-family:$typeface;
			font-weight:400;
			color:#333333;
		}
	}
	.contens{
		width:100%;
		height:112upx;
		background:#fff;
		margin-top: 16upx;
		.texts{
			margin-left: 32upx;
			margin-right: 50upx;
			font-size:28upx;
			font-family:$typeface;
			font-weight:500;
			color:#333333;
		}
		input{
			width: 500upx;
			height: 100%;
			font-size:32upx;
			font-family:$typeface;
			font-weight:400;
			color:rgba(51,51,51,1);
		}
	}
	.btn{
		width: 100%;
		height: 188upx;
		.imgs{
			width: 500upx;
			height: 88upx;
		}
	}
	.active{
		// width:200upx;
		height: 60upx;
		position: absolute;
		right: 56upx;
		top:350upx;
		font-size: 28upx;
		font-family: $typeface1;
		font-weight: 400;
		color: #C1C1C1;
	}

</style>
